<template>
  <!-- 保险公司定损额-->
  <view class="normal-login-container">

    <view class="item-wrap" style="margin-bottom: 0">
      <view class="lineBottom10">
        <uni-section title="保险公司定损额（车）" type="line"/>
      </view>

      <view style="margin: 8rpx 20rpx 8rpx 20rpx">
        <uni-forms ref="ruleForm" :rules="rules" :label-position="boole ? 'top' : 'left'" :model="ruleForm"
                   labelWidth="auto">

          <uni-forms-item label="定损总计:" name="assessmentTotalPrice" :required="boole">
            <text class="assessmentTotalPrice"/>
            <uni-easyinput v-if="boole" v-model="ruleForm.assessmentTotalPrice"
                           disabled
                           placeholder="请输入定损总计"/>
            <text v-else> {{ ruleForm.assessmentTotalPrice || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="主车定损金额:" name="vehicleAssessmentPrice" :required="boole">
            <text class="vehicleAssessmentPrice"/>
            <uni-easyinput v-if="boole" v-model="ruleForm.vehicleAssessmentPrice"
                           @blur="blurAmount('vehicleAssessmentPrice')"
                           @clear="clear('vehicleAssessmentPrice')"
                           placeholder="请输入主车定损金额"/>
            <text v-else> {{ ruleForm.vehicleAssessmentPrice || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="拍卖公司残值:" name="residualValue" :required="boole">
            <text class="residualValue"/>
            <uni-easyinput v-if="boole" v-model="ruleForm.residualValue"
                           @clear="clear('residualValue')"
                           @blur="blurAmount('residualValue')"
                           placeholder="请输入拍卖公司残值"/>
            <text v-else> {{ ruleForm.residualValue || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="其他金额:">
            <uni-easyinput v-if="boole" v-model="ruleForm.carOther"
                           @clear="clear('carOther')"
                           @blur="blurAmount('carOther')"
                           placeholder="请输入其他金额"/>
            <text v-else> {{ ruleForm.carOther || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="拍卖公司名称:" name="auctionCompanyName" :required="boole">
            <text class="auctionCompanyName"/>
            <uni-easyinput v-if="boole" v-model="ruleForm.auctionCompanyName"
                           placeholder="请输入拍卖公司名称"/>
            <text v-else> {{ ruleForm.auctionCompanyName || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="银行账号:">
            <text class="bankAccount"/>
            <uni-easyinput v-if="boole" v-model="ruleForm.bankAccount"
                           placeholder="请输入银行账号"/>
            <text v-else> {{ ruleForm.bankAccount || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="拍卖公司残值附件:" name="residualUrl" :required="boole">
            <text class="residualUrl"/>
            <image-common :disabled="!boole" :up-type="2" v-model="ruleForm.residualUrl"/>
          </uni-forms-item>

        </uni-forms>
      </view>
    </view>
  </view>
</template>

<script>
import {toNumberAdd, toNumberRide} from '@/pages/quota/libs/utils.js';
export default {
  name: 'insuranceAmount',//保险公司定损额（车）
  components: {},
  props: {
    value: {
      type: Object,
      default: {},
    },
    boole: {
      type: Boolean,
      default: true,
    },
  },
  computed: {
    ruleForm: {
      get() {
        let that = this;
        const proxy = new Proxy(that.value, {
          get(target, key) {
            return Reflect.get(target, key);
          },
          set(target, key, value) {
            that.$emit("input", {...target, [key]: value});
            return true;
          },
        });
        return proxy;
      },
    },
  },
  watch: {
    'value.residualUrl': {
      handler(val) {
        if (val) {
          this.$refs.ruleForm.clearValidate(['residualUrl'])
        }
      },
      deep: true,
    }
  },
  data() {
    return {
      rules: {
        assessmentTotalPrice: {
          rules: [
            {
              required: true,
              errorMessage: "请输入定损总计",
              validateTrigger: "blur",
            }
          ]
        },
        vehicleAssessmentPrice: {
          rules: [
            {
              required: true,
              errorMessage: "请输入主车定损金额",
              validateTrigger: "blur",
            }
          ]
        },
        residualValue: {
          rules: [
            {
              required: true,
              errorMessage: "请输入拍卖公司残值",
              validateTrigger: "blur",
            }
          ]
        },
        auctionCompanyName: {
          rules: [
            {
              required: true,
              errorMessage: "请输入拍卖公司名称",
              validateTrigger: "blur",
            }
          ]
        },
        residualUrl: {
          rules: [
            {
              required: true,
              errorMessage: "上传拍卖公司残值附件",
              validateTrigger: "blur",
            }
          ]
        }
      }
    };
  },
  created() {
  },
  mounted() {
  },
  methods: {
    blurAmount(str) {
      if (this.ruleForm[str]) {
        let msg = /^(?:[1-9]\d*|0)(?:\.\d+)?$/;
        if (!msg.test(this.ruleForm[str])) {
          this.ruleForm[str] = "";
        } else {
          this.ruleForm[str] = this.ruleForm[str]
              .toString()
              .match(/^\d+(?:\.\d{0,2})?/)[0];
        }
      }
      this.sumPrice()
    },

    clear(str){
      this.value[str] = this.ruleForm[str] = ''
      this.sumPrice()
    },

    //定损总计
    sumPrice() {
      let num = 0;
      if (this.ruleForm.maintenanceType === "1") {
        num = toNumberAdd(
            toNumberAdd(
                Number(this.ruleForm.vehicleAssessmentPrice),
                Number(this.ruleForm.residualValue)
            )
            ,
            Number(this.ruleForm.carOther))
      }
      if (this.ruleForm.maintenanceType === "3") {
        num = toNumberAdd(
            toNumberAdd(
                Number(this.ruleForm.vehicleAssessmentPrice),
                Number(this.ruleForm.persionAssessmentPrice)
            )
            ,
            Number(this.ruleForm.otherAssessmentPrice))
      }
      console.log(num)
      this.value.assessmentTotalPrice = this.ruleForm.assessmentTotalPrice = num
          .toString()
          .match(/^\d+(?:\.\d{0,2})?/)[0];
    },

    handleEffect() {
      return new Promise((resolve, reject) => {
        this.$refs.ruleForm
            .validate()
            .then((res) => {
              resolve();
            })
            .catch((err) => {
              let key = ".flex-col" + ">>>" + "." + err[0].key;
              reject(key);
            });
      });
    },
  },
};
</script>

<style scoped lang=""></style>


